import React, { useState } from "react";

export default function FormCom() {
  //声明状态
  let [name, setName] = useState('');
  let [age, setAge] = useState('');

  //声明函数 单击事件处理程序
  let reg = () => {
    console.log(name, age);
  }

  let clear = () => {
    setName('');
    setAge('');
  }

  return (
    <div>
      <h2>欢迎来到世纪佳缘</h2>
      <hr />
      姓名: <input type="text" value={name} onChange={(e) => {
        setName(e.target.value);
      }}/>
      <br />
      年龄: <input type="text" value={age} onChange={e => setAge(e.target.value)} />
      <br />
      <hr />
      <button onClick={reg}>注册</button>
      <button onClick={clear}>清空</button>
    </div>
  );
}
